<template>
	<view>
		<!-- <view>
			<view style="height: 88rpx;"></view>
			<view class="top dis_f_l_c">
				<view class="black_f_40 font_w_bold">消息</view>
				<view class="dis_f_l_c mar_l_24" @click="delet()">
					<image class="t_img" src="../../static/image/shaochu.png" mode=""></image>
					<view class="grey_f_28">
						清除未读
					</view>
				</view>
			</view>
		</view>
		<view class="center">
			<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scroll="scroll">
				<view>
					<view style="min-height: 76vh;">
						<view class="lt_list dis_f_sb_c" v-for="(item,index) in data" @click="go_view()">
							<image class="y_img" :src="item.image" mode=""></image>
							<view class="y_list_r">
								<view class="dis_f_sb_c">
									<view class="black_f_28 font_w_bold">{{item.name}}</view>
									<view class="grey_s_24">{{item.time}}</view>
								</view>
								<view class="dis_f_sb_c" style="margin-top: 8rpx;">
									<view class="grey_f_28 slh_one r_text">{{item.text}}</view>
									<view class="box">
										<u-badge :type="type" bgColor="#FF6401" max="99" :value="item.value"></u-badge>
									</view>
								</view>
							</view>
						</view>
					</view>
					<image class="bo_js_er_img" src="../../static/image/zcxian.png" mode=""></image>
				</view>
			</scroll-view>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				type: "warning",
				value: 100,
				data: [{
					image: '../../static/logo.png',
					name: "同路仁店家",
					time: "刚刚",
					text: "亲，这个商品就只剩一件了哦，喜欢的话",
					value: 100
				}, {
					image: '../../static/logo.png',
					name: "同路仁用户昵称",
					time: "下午14:30",
					text: "您有一条店铺消息~",
					value: 10
				}, {
					image: '../../static/logo.png',
					name: "小翌",
					time: "2022-05-12",
					text: "你好呀",
					value: 0
				}],
				url:''
			}
		},
		onShow() {
			this.url=this.$.ajax_url3
			uni.navigateTo({
	  url: "/TUIKit/components/TUIConversation/index",
	});
		},
		onLoad() {
			uni.showLoading({
				title: '加载中'
			});

	},
	methods: {
		scroll: function(e) {
			// console.log(e)
			this.old.scrollTop = e.detail.scrollTop
		},
		goTop: function(e) {
			// 解决view层不同步的问题
			this.scrollTop = this.old.scrollTop
			this.$nextTick(function() {
				this.scrollTop = 0
			});
			uni.showToast({
				icon: "none",
				title: "纵向滚动 scrollTop 值已被修改为 0"
			})
		},
		delet() {

		},
		go_view() {
			uni.navigateTo({
				url: '/pages/news/newList'
			})
		}
	}
	}
</script>

<style lang="scss">
	.top {
		height: 88rpx;
		margin-left: 32rpx;

		.t_img {
			width: 32rpx;
			height: 32rpx;
			margin-right: 8rpx;
		}
	}

	.center {
		width: 750rpx;
		height: 88vh;
		// margin-top: 36rpx;
		border-radius: 24rpx 24rpx 0 0;
		background-color: #fff;
		position: fixed;
		top: 212rpx;
		left: 0;

		.scroll-Y {
			height: 88vh;

			// background-color: red;
			.lt_list {
				width: 686rpx;
				margin-left: 32rpx;
				margin-top: 32rpx;
				padding-bottom: 32rpx;
				border-bottom: 2rpx solid #F7FAFF;

				.y_img {
					width: 96rpx;
					height: 96rpx;
					border-radius: 100rpx;
					border: 2rpx solid #F7FAFF;
				}

				.y_list_r {
					width: 566rpx;

					.r_text {
						width: 484rpx;
					}
				}
			}

			.lt_list:last-child {
				border-bottom: none;
			}
		}

		.cen_bo_img {
			width: 750rpx;
			height: 40rpx;
			position: fixed;
			left: 0;
			bottom: 24rpx;
		}
	}
</style>